<template>
  <button class="btn" @click="onExport">导出CSV</button>
</template>

<script setup lang="ts">
import { useDataStore } from '../stores/dataStore';

const store = useDataStore();

function onExport() {
  const rows = store.history.map(d => [
    new Date(d.timestamp).toISOString(),
    d.turbidityNTU,
    d.flowLMin,
    d.pressureKPa,
    d.pumpRpm,
    d.inverterHz,
    d.valveOpenPct,
    d.status || ''
  ]);
  const header = ['timestamp', 'turbidityNTU', 'flowLMin', 'pressureKPa', 'pumpRpm', 'inverterHz', 'valveOpenPct', 'status'];
  const csv = [header, ...rows].map(r => r.join(',')).join('\n');
  const blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
  const url = URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href = url; a.download = `qingyu-data-${Date.now()}.csv`;
  a.click();
  URL.revokeObjectURL(url);
}
</script>

<style scoped>
.btn { padding: 6px 10px; border: 1px solid #d1d5db; background: #fff; border-radius: 6px; cursor: pointer; }
.btn:hover { background: #f3f4f6; }
</style>



